aixp-logo

Integration

Integrating your business with AIXP is the first step in getting closer to your customers. Once integrated, you will immediately start getting data about your customers' behavior. If you need any assistance in deciding which API is the best for your business, please contact our integration specialist.

Basic Integration

To get started, you will need to install the initialization. The initialization code for integration can be seen in the page Integration > Sources> Go to source > Overview

  • Real-time tracking

    There are several ways how to get your data into AIXP

  • Web Aplication

    To integrate your Web Application with AIXP, you need to copy-paste the following initialization code into the header of your webpage. You can install AIXP Analytics directly in your web application or use npm:

    Install it directly

    In your index.html file, add this line of code inside section.

    <script src="https://unpkg.com/aixp-js-sdk@1.0.4/dist/aixp-sdk-js.min.js">
    </script>
    <script type="text/javascript"> const planeUrl =
    "https://aixp-rudder-api.digitallab.id/11111111-1111-1111-1111- 111111111111/1e02b834-3ed7-46c0-bd06-4aa0ce2a6565";
    aixpTracker.load("1lgCItJ0FN5qSusbvZVESHjEHLq", planeUrl, { configUrl: planeUrl
    });
    </script>
    

    Add to your index.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- ADD THE AIXP SCRIPT HERE -->
    <title>Document</title>
    </head>
    <body>
    <!-- All of your html body goes here -->
    </body>
    </html>
    

    Using NPM

    In your application add aixp-js-sdk to your dependency.

    $ npm install aixp-js-sdk
    

    or

    $ yarn add aixp-js-sdk
    

    initialize aixpTracker in your app entrypoint

    import aixpTracker from "aixp-js-sdk"; const planeUrl =
    "https://aixp-rudder-api.digitallab.id/11111111-1111-1111-1111- 111111111111/1e02b834-3ed7-46c0-bd06-4aa0ce2a6565";
    aixpTracker.load("1lgCItJ0FN5qSusbvZVESHjEHLq", planeUrl, { configUrl: planeUrl
    })
    
  • Mobile Application (React-Native)

    Install aixpTracker for mobile apps using

    $ yarn add @rudderstack/rudder-sdk-react-native
    

    *Note if the tracker doesn't work properly after installed try using the version 1.0.2

    add maven dependency, open the build.gradle in your android/build.gradle, and add the following code

    maven {
    url { "https://dl.bintray.com/rudderstack/rudderstack" }
    }
    

    intialize aixp analytics in your entrypoint

    import aixpTracker from '@rudderstack/rudder-sdk-react-native' await aixpTracker.setup( "1lgCItJ0FN5qSusbvZVESHjEHLq", {
    dataPlaneUrl: "https://aixp-rudder-api.digitallab.id/11111111-1111-1111-1111-111111111111/1e02b834-3ed7-46c0-bd06-4aa0ce2a6565",
    controlPlaneUrl: "https://aixp-rudder-api.digitallab.id/11111111-1111- 1111-1111-111111111111/1e02b834-3ed7-46c0-bd06-4aa0ce2a6565",
    trackLifecycleEvents: true, recordScreenViews: true
    })
    

Events & Customer Identification

In AIXP, we will need to track and identify customers with the following step below

  • Track Event

    After install the AIXP ANALYTICS, we could track the event inside of your apps and send the data to the project in AIXP

    To track the event happened inside our apps call the track method from aixpTracker that we have initialize before

    These code can be seen in the page Data&Assets > Data Manager > Event

    Copy the event code

    aixpTracker.track('Your Event Name', {
    // Your Event Properties goes here
    })
    

    Fill the event name, and the properties with the event you registered in your AIXP Data Manager

    Example of Events : Payment

    The payment event tracks the basic payment transaction of your customers. It is crucial for analyzing the overall performance of your business, evaluating campaigns, calculating the lifetime value of your customers and much more.

    Overview of event properties to track:

    The example of code snippet for event payment

    aixpTracker.track("delivery", {
      paymentStatus: false,
      productName: “”,
      productPrice: 0,
      paymentType: “”,
      timeTransaction: 2021-03-13 02:39:58
    });
    
  • Identify User

    Identify User is used to make sure your user is identified by AIXP. Using the aixpTracker, call the identify

    method.

    aixpTracker.identify("Your uniqe identifier based on Identity property you have been registered in aixp Data Manager", {
    // Your Other Properties in AIXP Data Manager Goes Here
    })
    

    Reset User Identity

    You can clear current user information inside your apps using reset method. Usually this is used in Logout operations.

    aixpTracker.reset(); 
    aixpTracker.setAnonymousId("random uuid");